#personalHomePage {
    @include flexbox();
    @include flex-direction(column);
    height: 100%;
    z-index: 0;
    background: rgba(255, 255, 255, 1);
  
    header {
      .title {
        position: absolute;
        height: 45px;
        line-height: 45px;
        width: 100%;
        top: 0;
        left: 0;
        text-align: center;
        font-size: 18px;
        color: #fff;
        z-index: 99;
   
        img {
          position: absolute;
          left: 15px;
          top: 50%;
          transform: translateY(-50%);
      z-index: 99;
  
        }
      }
  
      .bigImg {
        @include flexbox();
        @include flex-direction(column);
        @include justify-content(center);
        @include align-content(center);
        height: 230px;
        width: 100%;
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: center;
        position: relative;
  
        div {
          @include flexbox();
  
          img {
            border: 1px solid #fff;
            border-radius: 50%;
            margin: auto;
            z-index: 99;
  
          }
        }
  
        p {
          text-align: center;
          font-size: 18px;
          color: #fff;
          z-index: 99;
  
        }
  
      }
    }
  
    .nav {
      @include flexbox();
      height: 50px;
      line-height: 50px;
      background: #fff;
  
      div {
        @include flex();
        text-align: center;
  
        a {
          display: inline-block;
          margin: auto;
          padding: 0 3px;
          height: 50px;
          font-size: 16px;
          color: rgba(51, 51, 51, 1);
  
          b {
            font-weight: normal;
          }
        }
      }
  
      div.active {
        a {
          color: #528e75;
          border-bottom: 2px solid #528e75;
        }
  
      }
    }
  
    .border-5 {
      width: 100%;
      height: 5px;
      background: #F6F6F6;
    }
  
    .swipe {
      @include flex();
      width: 100%;
  
      .myTidings {
        width: 100%;
        height: 100%;
        overflow-y: scroll;
  
        ul {
  
          // <!-- 和我的直播间版本一个 -->
          li {
            padding: 20px 0;
            margin: 0 15px;
            border-bottom: 1px solid rgba(229, 229, 229, 1);
  
            &>a {
              @include flexbox();
  
              &>img {
                width: 112px !important;
                height: 85px !important;
              }
  
              &>div {
                margin-left: 10px;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                h3 {
                  font-size: 16px;
                  width: 100%;
                  color: rgb(51, 51, 51);
                  overflow: hidden;
                  white-space: nowrap;
                  text-overflow: ellipsis;
                }
  
                div {
                  font-size: 13px;
                  width: 100%;
                  color: rgb(75, 75, 75);
                  overflow: hidden;
                  white-space: nowrap;
                  text-overflow: ellipsis;
                }
  
                p {
                  .discount {
                      height: 20px;
                      width: 50px;
                      line-height: 20px;
                      border-radius: 13px;
                      display: block;
                      text-align: center;
                      font-size: 12px;
                    }
                }
              }
            }
          }
        }
      }
  
      .myConcern {
        width: 100%;
        height: 100%;
        overflow-y: scroll;
  
        ul {
          li {
            @include flexbox();
            margin: 0 15px;
            padding: 15px 0;
            border-bottom: 1px solid rgb(229, 229, 229);
  
            &>a {
              @include flex();
              @include flexbox();
  
              &>p {
                @include flexbox();
                @include justify-content(center);
                @include align-content(center);
                border: 1px solid #EDEDED;
                border-radius: 50%;
                margin-right: 10px;
                text-align: center;
                width: 50px;
                height: 50px;
  
                img {
                  width: 45px !important;
                  height: 45px !important;
                  border-radius: 50%;
                  padding: 1px;
                  margin: auto;
                }
              }
  
              div {
                @include flex();
  
                h3 {
                  font-size: 16px;
                  color: rgb(51, 51, 51);
                  height: 100%;
                  display:flex;
                  align-items: center
                }
  
                &>p {
                  @include flexbox();
                  @include align-content(center);
                  margin-top: 5px;
  
                  img {
                    margin-top: 2px;
                    margin-right: 5px;
                    width: 13px !important;
                    height: 13px !important;
                  }
  
                  b,
                  span {
                    font-size: 12px;
                    color: rgba(156, 156, 156, 1);
                    font-weight: normal;
                  }
  
                  span {
                    margin-left: 17px;
                    margin-right: 5px;
                  }
                }
              }
            }
  
            &>div {
              @include flexbox();
              // width: 45px;
              text-align: right;
  
              img {
                margin: auto;
                width: 27px !important;
                height: 27px !important;
              }
  
              a {
                margin: auto;
                font-size: 12px;
                padding: 2px 5px;
                border-radius: 12px;
                text-align: center;
                color: #528e75;
                border: 1px solid #528e75;
              }
            }
          }
        }
      }
  
      .myFun {
        width: 100%;
        height: 100%;
        overflow-y: scroll;
  
        ul {
          li {
            @include flexbox();
            margin: 0 15px;
            padding: 15px 0;
            border-bottom: 1px solid rgb(229, 229, 229);
  
            a {
              @include flex();
              @include flexbox();
  
              &>p {
                @include flexbox();
                @include justify-content(center);
                @include align-content(center);
                border: 1px solid #EDEDED;
                border-radius: 50%;
                margin-right: 10px;
                text-align: center;
                width: 50px;
                height: 50px;
  
                img {
                  width: 45px !important;
                  height: 45px !important;
                  border-radius: 50%;
                  padding: 1px;
                  margin: auto;
                }
              }
  
              div {
                @include flex();
  
                h3 {
                  font-size: 16px;
                  // margin-top: 3px;
                  line-height: 50px;
                  color: rgb(51, 51, 51);
                }
  
                &>p {
                  @include flexbox();
                  @include align-content(center);
                  margin-top: 5px;
  
                  img {
                    margin-top: 2px;
                    margin-right: 5px;
                    width: 13px !important;
                    height: 13px !important;
                  }
  
                  b,
                  span {
                    font-size: 12px;
                    color: rgba(156, 156, 156, 1);
                    font-weight: normal;
                  }
  
                  span {
                    margin-left: 17px;
                    margin-right: 5px;
                  }
                }
              }
            }
  
            &>div {
              @include flexbox();
              width: 45px;
              text-align: right;
  
              img {
                margin: auto;
                width: 27px !important;
                height: 27px !important;
              }
            }
          }
        }
      }
    }
  }
  